package id.net.iconpln.bb.client.view;

import id.net.iconpln.bb.client.data.TestData;

import id.net.iconpln.bb.client.model.Pemakaian;
import id.net.iconpln.bb.client.model.Stock;

import java.util.ArrayList;
import java.util.List;

import com.extjs.gxt.ui.client.Style.HorizontalAlignment;
import com.extjs.gxt.ui.client.Style.Orientation;
import com.extjs.gxt.ui.client.Style.SelectionMode;
import com.extjs.gxt.ui.client.binding.FormBinding;
import com.extjs.gxt.ui.client.binding.TimeFieldBinding;
import com.extjs.gxt.ui.client.data.ModelData;
import com.extjs.gxt.ui.client.event.ButtonEvent;
import com.extjs.gxt.ui.client.event.Events;
import com.extjs.gxt.ui.client.event.Listener;
import com.extjs.gxt.ui.client.event.SelectionChangedEvent;
import com.extjs.gxt.ui.client.event.SelectionListener;
import com.extjs.gxt.ui.client.store.ListStore;
import com.extjs.gxt.ui.client.store.Store;
import com.extjs.gxt.ui.client.widget.ContentPanel;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.button.Button;
import com.extjs.gxt.ui.client.widget.form.DateField;
import com.extjs.gxt.ui.client.widget.form.DateTimePropertyEditor;
import com.extjs.gxt.ui.client.widget.form.FieldSet;
import com.extjs.gxt.ui.client.widget.form.FormPanel;
import com.extjs.gxt.ui.client.widget.form.TextField;
import com.extjs.gxt.ui.client.widget.form.TimeField;
import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;
import com.extjs.gxt.ui.client.widget.grid.ColumnData;
import com.extjs.gxt.ui.client.widget.grid.ColumnModel;
import com.extjs.gxt.ui.client.widget.grid.Grid;
import com.extjs.gxt.ui.client.widget.grid.GridCellRenderer;
import com.extjs.gxt.ui.client.widget.layout.FitData;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;
import com.extjs.gxt.ui.client.widget.layout.FormData;
import com.extjs.gxt.ui.client.widget.layout.FormLayout;
import com.extjs.gxt.ui.client.widget.layout.RowData;
import com.extjs.gxt.ui.client.widget.layout.RowLayout;
import com.extjs.gxt.ui.client.widget.table.NumberCellRenderer;
import com.google.gwt.i18n.client.DateTimeFormat;
import com.google.gwt.i18n.client.NumberFormat;
import com.google.gwt.user.client.Element;

public class PageBbPakai extends LayoutContainer {
	private FormBinding formBindings;  
	private FormData formData;
	private FormPanel panel;
	private Grid<Pemakaian> grid;
	
	  @Override  
	  protected void onRender(Element parent, int index) {  
	    super.onRender(parent, index);  
	    setLayout(new FitLayout());
	    
	    formData = new FormData("-20"); 
	    ContentPanel cp = new ContentPanel();  
	  
	    cp.setHeading("Pemakaian Batubara");  
	    cp.setFrame(true);  
	    cp.setSize(900, 400);  
	    cp.setLayout(new RowLayout(Orientation.HORIZONTAL));  
	  
	    grid = createGrid();  
	    grid.getSelectionModel().setSelectionMode(SelectionMode.SINGLE);  
	    grid.getSelectionModel().addListener(Events.SelectionChange,  
	        new Listener<SelectionChangedEvent<Pemakaian>>() {  
	          public void handleEvent(SelectionChangedEvent<Pemakaian> be) {  
	            if (be.getSelection().size() > 0) {
//	        	    final TimeField field = new TimeField();
//	        	    TimeFieldBinding binding = new TimeFieldBinding(field, "jam");
//	        	    Stock stock = TestData.getStocks().get(0);
//	        	    binding.bind((ModelData) be.getSelection().get(0));

	              formBindings.bind((ModelData) be.getSelection().get(0));  
	            } else {  
	              formBindings.unbind();  
	            }  
	          }  
	        });  	     
	  
	    FormPanel panel = createForm();  
	    formBindings = new FormBinding(panel, true);  
	    formBindings.setStore((Store) grid.getStore());  
	  
	    cp.add(panel, new RowData(.4, 1));
	    cp.add(grid, new RowData(.6, 1));
	    
	    
//		setScrollMode(Scroll.AUTO);		
	    add(cp, new FitData(5));  
	  }  
	  
	  private FormPanel createForm() {  
	    panel = new FormPanel();	    
	    panel.setHeaderVisible(false);
	    
	    FieldSet fieldSet = new FieldSet();  
	    fieldSet.setHeading("Data pemakaian");  
	    fieldSet.setCollapsible(false);
	    
	  
	    FormLayout layout = new FormLayout();  
	    layout.setLabelWidth(120);  
	    fieldSet.setLayout(layout);  
	    	    
	    
	    DateField date = new DateField();
	    DateTimeFormat t = DateTimeFormat.getFormat("dd/MM/yyyy");
	    date.setFieldLabel("Tanggal");
	    date.setName("tanggal");	    	  
	    date.setPropertyEditor(new DateTimePropertyEditor(t));
	    fieldSet.add(date, formData);  
	  
//	    DateTimeFormat j = DateTim	eFormat.getFormat("h:mma");
//	    
	    TimeField time = new TimeField();  
	    time.setFieldLabel("Jam");
//	    time.setName("jam");
	    fieldSet.add(time, formData);  
	    
	    TextField<String> pakai = new TextField<String>();  
	    pakai.setName("pakai");  
	    pakai.setFieldLabel("Pemakaian (Ton)");    
	    fieldSet.add(pakai, formData);	  	  
	    	     
	    TextField<String> unit = new TextField<String>();	    
	    unit.setName("unit");  
	    unit.setFieldLabel("unit");    
	    fieldSet.add(unit, formData);

	    TextField<String> ket = new TextField<String>();	    
	    ket.setName("ket");  
	    ket.setFieldLabel("Keterangan");    
	    fieldSet.add(ket, formData);	    	    

	    panel.add(fieldSet);  	     


	    ContentPanel p = new ContentPanel();
	    p.setHeaderVisible(false);	    
	    p.setButtonAlign(HorizontalAlignment.RIGHT);  
	    p.addButton(new Button("Reset", new SelectionListener<ButtonEvent>() {  
	      @Override  
	      public void componentSelected(ButtonEvent ce) {  
	        grid.getStore().rejectChanges();
	        panel.clear();
	      }  
	    }));  
	    p.addButton(new Button("Submit", new SelectionListener<ButtonEvent>() {  
	      @Override  
	      public void componentSelected(ButtonEvent ce) {  
	        grid.getStore().commitChanges();  
	      }  
	    }));  

	    panel.add(p);
	    
	    return panel;  
	  }  
	  
	  private Grid<Pemakaian> createGrid() {  
	    final NumberFormat currency = NumberFormat.getCurrencyFormat();  
	    final NumberFormat number = NumberFormat.getFormat("0.00");  
	    final NumberCellRenderer<Grid<Stock>> numberRenderer = new NumberCellRenderer<Grid<Stock>>(  
	        currency);  
	  
	    GridCellRenderer<Stock> change = new GridCellRenderer<Stock>() {  
	  
	      public String render(Stock model, String property, ColumnData config, int rowIndex,  
	          int colIndex, ListStore<Stock> store, Grid<Stock> grid) {  
	        double val = (Double) model.get(property);  
	        String style = val < 0 ? "red" : "green";  
	        return "<span style='color:" + style + "'>" + number.format(val) + "</span>";  
	      }  
	    };  
	  
	    GridCellRenderer<Stock> gridNumber = new GridCellRenderer<Stock>() {  
	      public String render(Stock model, String property, ColumnData config, int rowIndex,  
	          int colIndex, ListStore<Stock> store, Grid<Stock> grid) {  
	        return numberRenderer.render(null, property, model.get(property));  
	      }  
	    };  
	  
	    List<ColumnConfig> configs = new ArrayList<ColumnConfig>();  

	    ColumnConfig column = new ColumnConfig();	    	     
	    
	    DateTimeFormat t = DateTimeFormat.getFormat("dd/MM/yyyy");
	    
	    column = new ColumnConfig();  
	    column.setId("tanggal");  
	    column.setHeader("Tanggal");
	    column.setDateTimeFormat(DateTimeFormat.getFormat("dd/MM/yyyy"));
	    column.setWidth(80);    
	    configs.add(column);  

	    column = new ColumnConfig();  
	    column.setId("jam");  
	    column.setHeader("Jam");
	    column.setDateTimeFormat(DateTimeFormat.getFormat("h:mma"));
	    column.setWidth(70);  
	    configs.add(column);  	  
	    
	    column = new ColumnConfig();  
	    column.setId("pakai");  
	    column.setHeader("Pemakaian (Ton)");    
	    column.setWidth(100);    
	    configs.add(column);
	    
	    column = new ColumnConfig();  
	    column.setId("unit");  
	    column.setHeader("Unit");  
	    column.setWidth(150);  
	    configs.add(column);  
	  
	    column = new ColumnConfig();  
	    column.setId("ket");  
	    column.setHeader("Keterangan");    
	    column.setWidth(100);    
	    configs.add(column);
	    	            	     	    
	    
	    ListStore<Pemakaian> store = new ListStore<Pemakaian>();  
	    store.setMonitorChanges(true);  
	    store.add(TestData.getPemakaian());
	  
	    ColumnModel cm = new ColumnModel(configs);  
	  
	    Grid<Pemakaian> grid = new Grid<Pemakaian>(store, cm);  
	    grid.getView().setEmptyText("sdfd");  
	    grid.setBorders(false);  
//	    grid.setAutoExpandColumn("pemasok");  
	    grid.setBorders(true);  
	  
	    return grid;  
	  }  
}
